<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
<#include "../common/header.ftl">
</head>
<script>
    $(function () {

        jQuery.ajaxSettings.traditional = true;

        $('#pagination').twbsPagination({
            totalPages:${result.pages},
            startPage:${result.pageNum},
            visiblePages:${result.pageSize},
            first:"首页",
            prev:"上一页",
            next:"下一页",
            last:"莫邪",

            onPageClick:function(event,page){
                $('#currentPage').val(page);
                $("#searchForm").submit();
            }
        });
        //全选/全不选
        $("#allCheck").click(function () {
            $("[name=idCheck]").prop("checked",this.checked)
        })

        $(".batchDelete").click(function () {
            var checkbox=$("[name=idCheck]:checked")
            var ids = $.map(checkbox,function (item) {
                return $(item).data("emplid");
            })
            if(ids.length <= 0){
                $.messager.confirm("温馨提示","请选择删除对象",function () {
                })
                    return;
            }
            $.messager.confirm("温馨提示","确认删除吗",function () {

                $.post("/employee/batchDelete.do",{ids:ids},function (data) {
                    showMessager(data);
                })
            })
        })

        $(".exportXls").click(function () {
            window.open("/employee/exportXls.do")
        })
        
        
        $(".importData").click(function () {
            $("#myModal").modal('show')
        })

        $(".saveBtn").click(function () {
            $("#editForm").submit();
        })


        $(".deleteBtn").click(function () {
            var did = $(this).data("did")
            $.messager.confirm("温馨提示","确认删除吗",function () {
                $.post("/employee/delete.do?id="+did,function (data) {
                    showMessager(data);
                })
            })
        })

    })





</script>
<body>

<div class="container " style="margin-top: 20px">
<#include "../common/top.ftl">
    <div class="row">
        <div class="col-sm-3">
        <#include "../common/menu.ftl">
        </div>
        <div class="col-sm-9">
            <div class="row">
                <div class="col-sm-12">
                    <h1 class="page-head-line">员工管理</h1>
                </div>
            </div>
            <!--高级查询--->
            <form class="form-inline" id="searchForm" action="/employee/list.do" method="post">
                <input type="hidden" name="currentPage" id="currentPage" value="1">
                <div class="form-group">
                    <label for="keyword">关键字:</label>
                    <input type="text" class="form-control" id="keyword" name="keyword" value="${(qo.keyword)!}" placeholder="请输入姓名/邮箱">
                </div>
                    <div class="form-group">
                        <label for="dept">部门:</label>
                        <select class="form-control" id="dept" name="deptId">
                            <option value="-1">全部</option>
                        <#list depts as d >
                            <option value="${(d.id)!}" <#if '${d.id}'=='${qo.deptId}'>
                                    selected
                            </#if>>${(d.name)!}</option>
                        </#list>
                        </select>
                    <#--<script>-->
                        <#--$("#dept option[value='${qo.deptId}']").prop("selected", true);-->
                    <#--</script>-->
                </div>
                <button id="btn_query" class="btn btn-default">查询</button>
                <a href="/employee/input.do" class="btn btn-success">添加</a>
                <input type="button" class="btn btn-success batchDelete" value="批量删除">
                <input type="button" class="btn btn-success exportXls" value="导出数据">
                <input type="button" class="btn btn-success importData" value="导入数据">
            </form>

            <table class="table table-striped table-hover" >
                <thead>
                    <tr>
                        <th>
                        <input type="checkbox" name="allCheck" id="allCheck"></th>
                        <th>编号</th>
                        <th>名称</th>
                        <th>email</th>
                        <th>年龄</th>
                        <th>部门</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <#list result.list as entity >
                   <tr>
                       <td><input type="checkbox" name="idCheck" data-emplid="${entity.id}"></td>
                       <td>${entity_index}</td>
                       <td>${(entity.name)!}</td>
                       <td>${(entity.email)!}</td>
                       <td>${(entity.age)!}</td>
                       <td>${(entity.dept.name)!}</td>
                       <td>
                           <a class="btn btn-info btn-xs" href="/employee/input.do?id=${entity.id}">
                               <span class="glyphicon glyphicon-pencil"></span>编辑
                           </a>
                           <a  class="btn btn-danger btn-xs deleteBtn" data-did="${(entity.id)!}">
                               <span class="glyphicon glyphicon-trash"></span>删除
                           </a>
                       </td>
                   </tr>
                </#list>
            </table>
            <div style="text-align: center;">
                <ul id="pagination" class="pagination"></ul>
            </div>
        </div>
    </div>
</div>


<div class="modal fade " tabindex="-1" id="myModal" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">導入數據</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" action="/employee/importData.do" method="post" enctype="multipart/form-data"  id="editForm">
                    <div class="form-group" >
                        <label for="name" class="col-sm-3 control-label"></label>
                        <div class="col-sm-6">
                            <input type="file"  name="file">
                        </div>
                    </div>
                </form>
                <a  class="btn btn-danger btn-xs " onclick="window.open('/template/employee.xls')">下載模板</a>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary saveBtn" >确认</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</body>
</html>